/* 弹性两端对齐 */
.flex_bet {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.flex_bet1{
    display: flex;
    justify-content: space-between;
    align-items: center;
    
}
.flex_wrapO{
    flex-wrap: wrap;
}
/* //最右 */
.flex_end {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    div{
        margin-left: 10px;
    }
    div:first-child{
        margin-left: 0px;

    }
}

.flex-end{
    align-items: flex-end;
    justify-content: space-between;
}
.flex_spa {
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.flex_start {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.flex_cen {
    display: flex;
    justify-content: center;
    align-items: center;
}
.flex-start{
    justify-content: flex-start;
    display: flex;
}
/* 行式弹性盒子 */
.flex_row {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
}
.flex_col {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
}


/* 弹性盒子弹性容器 */
.flex_col .flex_grow {
    width: 0;
    flex-grow: 1;
}

.flex_row .flex_grow {
    flex-grow: 1;
}

/* 弹性盒子允许换行 */
.flex_wrap {
    flex-wrap: wrap;
}

/* 弹性盒子居中对齐 */
.flex_col.flex_center,
.flex_row.flex_center {
    justify-content: center;
}

/* 列式弹性盒子两端对齐 */
.flex_col.flex_space {
    justify-content: space-between;
}

/* 弹性盒子快速分栏 */
.flex_col_2 {
    width: 50%;
}
.flex_col_2Two {
    width: 48%;
}
.flex_col_3 {
    width: 33.33333%;
}
.flex_col_31 {
    width: 31%;
}

.flex_col_4 {
    width: 25%;
}

.flex_col_5 {
    width: 20%;
}

.flex_col_6 {
    width: 16.66666%;
}

.text_c{
    text-align: center;
}
// 全局 margin 与 padding 样式定义
.m-0 {
    margin: 0px;
}
.m-5 {
    margin: 5px;
}

.ml-5 {
    margin-left: 5px;
}

.mr-5 {
    margin-right: 5px;
}

.mt-5 {
    margin-top: 5px;
}

.mb-5 {
    margin-bottom: 5px;
}

.m-10 {
    margin: 10px;
}

.ml-10 {
    margin-left: 10px;
}

.mr-10 {
    margin-right: 10px;
}

.mt-10 {
    margin-top: 10px;
}

.mb-10 {
    margin-bottom: 10px;
}

.m-15 {
    margin: -15px;
}

.ml-15 {
    margin-left: -15px;
}

.mr-15 {
    margin-right: 15px;
}

.mt-15 {
    margin-top: 15px;
}

.mb-15 {
    margin-bottom: 15px;
}

.m-20 {
    margin: 20px;
}

.ml-20 {
    margin-left: 20px;
}

.mr-20 {
    margin-right: 20px;
}

.mt-20 {
    margin-top: 20px;
}

.mb-20 {
    margin-bottom: 20px;
}

// 全局padding样式定义
.p-0 {
    padding: 0px;
}
.p-5 {
    padding: 5px;
}

.pl-5 {
    padding-left: 5px;
}

.pr-5 {
    padding-right: 5px;
}

.pt-5 {
    padding-top: 5px;
}

.pb-5 {
    padding-bottom: 5px;
}

.p-10 {
    padding: 10px;
}

.pl-10 {
    padding-left: 10px;
}

.pr-10 {
    padding-right: 10px;
}

.pt-10 {
    padding-top: 10px;
}

.pb-10 {
    padding-bottom: 10px;
}

.p-15 {
    padding: -15px;
}

.pl-15 {
    padding-left: -15px;
}

.pr-15 {
    padding-right: -15px;
}

.pt-15 {
    padding-top: -15px;
}

.pb-15 {
    padding-bottom: -15px;
}

.p-20 {
    padding: 20px;
}

.pl-20 {
    padding-left: 20px;
}

.pr-20 {
    padding-right: 20px;
}

.pt-20 {
    padding-top: 20px;
}

.pb-20 {
    padding-bottom: 20px;
}
